function showmodal(options) {

    var defaults = {
        ajaxLink:'',
        postData:'',
        showMask:true,
        showId:"jmodal",
        title:"Modal Box",
        titleColor:'#fff',
        titleBg:'#EFB632',
        width:330,
        height:200
    };

    var options = $.extend(defaults, options);

    var mask = $('<div id="mask"></div>');

    //Hide mask and popup


    //Our function that listens for escape key.
    function handleEscape(e) {
        if (e.keyCode == 27) {
            modalHide();
        }
    }


    return $(this).click(function (e) {

        if (options.showMask) {
            $('body').append(mask.click(function () {
                modalHide();
            }));
        }
        var id = $("#" + options.showId);

        //Get the screen height and width
        var maskHeight = $(document).height();
        var maskWidth = $(window).width();

        $('#mask').css({'width':maskWidth, 'height':maskHeight});

        //transition effect
        $('#mask').fadeIn(1000);
        $('#mask').fadeTo("slow", 0.8);

        //Get the window height and width
        var winH = $(window).height();
        var winW = $(window).width();

        //Set the popup window to center
        $(id).addClass('window');
        $(id).css('width', options.width + 'px');
        $(id).css('height', options.height + 'px');
        $(id).css('top', winH / 2 - $(id).height() / 2);
        $(id).css('left', winW / 2 - $(id).width() / 2);
        $(id).css("opacity", 0.8);

        var mdTitle = $('<div class="modalTitle">' + options.title + '</div>');
        $(mdTitle).css('background', options.titleBg);
        $(mdTitle).css('color', options.titleColor);

        var closebt = $('<a title="Close">x</a>');
        $(closebt).css('color', options.titleColor);
        $(closebt).css('line-height', '30px');
        $(closebt).css('font-size', '12px');
        $(closebt).css('float', 'right');
        $(closebt).css('padding', '0px 5px');
        $(closebt).css('cursor', 'pointer');
        $(closebt).hover(function () {
            $(this).css('color', '000');
        }, function () {
            $(this).css('color', options.titleColor);
        });

        $(closebt).click(function () {
            modalHide();
            return false;
        });
        $(mdTitle).append($(closebt));

        var mdContent = $("<div class='modalContent'></div>").css('height', $(id).height()-40);

        if (options.ajaxLink) {
            $.ajax({
                url:options.ajaxLink,
                data:options.postData,
                success:function (data) {
                    $(mdContent).append(data);
                }
            });
        }
        $(mdContent).css('padding','5px');
        $(id).html(mdTitle);
        $(id).append(mdContent);
        //transition effect
        $(id).fadeIn(2000);

        //Prevent the anchor link from loading
        e.preventDefault();
        //Activate a listener
        $(document).keydown(handleEscape);


    });
}
    function modalHide() {
        $(document).unbind("keydown", handleEscape);

        if (options.showMask) {
            var remove = function () {
                $(this).remove();
            }
            $('#mask').fadeOut(remove);
        }

        $('.window').hide();
    }
    $(window).resize(function () {

        var box = $('#'+options.showId);

        //Get the screen height and width
        var maskHeight = $(document).height();
        var maskWidth = $(window).width();

        //Set height and width to mask to fill up the whole screen
        $('#mask').css({'width':maskWidth, 'height':maskHeight});

        //Get the window height and width
        var winH = $(window).height();
        var winW = $(window).width();

        //Set the popup window to center
        box.css('top', winH / 2 - box.height() / 2);
        box.css('left', winW / 2 - box.width() / 2);

    });
